<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>jsRipOff - Mobile version</title>

	<script src="../../depends/jquery.js" type="text/javascript"></script>
	<script src="../../lina.js/lina.js" type="text/javascript"></script>
	<script src="../../arcade.js/arcade.js" type="text/javascript"></script>
	<script src="../../arcade.js/arcade-controls.js" type="text/javascript"></script>
	<script src="jsRipOff.js" type="text/javascript"></script>

	<!-- Safari/iPhone: Display web content in full-screen mode -->
	<meta name="apple-mobile-web-app-capable" content="yes">
	<!-- Safari/iPhone: Hide status bar (requires full-screen mode) -->
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<!-- Safari/iPhone: Set fixed viewport -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<!-- Safari/iPhone: Define App icon -->
	<link rel="apple-touch-icon" href="apple-touch-icon.png">
	<!-- Safari/iPhone: Define startup icon -->
	<link rel="apple-touch-startup-image" href="startup.png">

	<script type="text/javascript">

	$(function(){
		var canvas = document.getElementById("gameCanvas");
		var game = new RipOffGame(canvas, {
			fullscreenMode: true,
			debug: {
				showFps: true,
				logToCanvas: false
			}
			});
		// Add iPod extensions
		game.stick = game.addObject(new TouchStick({
			id: "stick",
			pos: new Point2(60, canvas.height - 60),
			r1: 10,
			r2: 30,
			r3: 60
		}));
		game.button = game.addObject(new TouchButton({
			id: "button",
			pos: new Point2(canvas.width - 40, canvas.height - 40),
			r: 20,
			r3: 40,
			onClick: function(){ }
		}));
		game.onResize = function(width, height, e){
			// Adjust controls that are relative to right or bottom border
			game.stick.pos = new Point2(60, height - 60);
			game.button.pos = new Point2(width - 40, height - 40);
			// Let ArcadeGame adjust canvas size to new dimensions
			return true;
		};
		if(window.navigator){
			if(window.navigator.standalone === false){
				// Scroll one pixel down, so Safari URL toolbar disappears
				alert("This web page is optimized to run in fullscreen mode.\n"
					  + "Use the 'Add to Home Screen' function at the bottom of this page and restart this game from the new link icon.");
				setTimeout(scrollTo, 10, 0, 1);
			}else if(window.navigator.standalone !== true){
				alert("This web page is optimized to run on iPhones/iPods.");
			}
		}
	});
	</script>

<style>
* {
	margin: 0;
	padding: 0;
}
body, html {
	width: 100%;
	height: 100%;
}
#gameCanvas {
}
</style>
</head>

<body>
	<canvas id="gameCanvas" class="arcade-js">This game requires HTML 5 support.</canvas>
</body>
</html>
